import * as React from 'react';
import { useState } from 'react';
import { User } from '../screen/project-list/search-panel';

import * as auth from '../auth-provider';

interface AuthForm {
    username: string;
    password: string;
}

const AuthContext = React.createContext<
    | {
          user: User | null;
          login: (form: AuthForm) => Promise<void>;
          logout: () => Promise<void>;
      }
    | undefined
>(undefined);

AuthContext.displayName = 'AuthContext';

export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
    const [user, setUser] = useState<User | null>(null);
    const login = (form: AuthForm) => auth.login(form).then(setUser);
    const logout = () => auth.logout().then(() => setUser(null));

    return (
        <AuthContext.Provider
            children={children}
            value={{ user, login, logout }}
        />
    );
};

export const useAuth = () => {
    const context = React.useContext(AuthContext);
    if (!context) {
        throw new Error('useAuth必须在AuthProvider中使用');
    }

    return context;
};
